<!--
 * @Author: 迷洛洛ywc
 * @Date: 2024-04-15 13:05:31
 * @LastEditors: 迷洛洛ywc
 * @LastEditTime: 2024-05-06 15:15:45
 * @Description: 采收弹窗组件
-->
<template>
  <div class="seedAdd">
    <el-form
      :model="pickForm"
      ref="pickForm"
      :rules="rules"
      label-width="100px"
      class="demo-ruleForm"
    >
      <el-form-item label="作业方式" prop="harvestingWay">
        <el-radio-group v-model="pickForm.harvestingWay">
          <el-radio :label="0">人工</el-radio>
          <el-radio :label="1">机械</el-radio>
        </el-radio-group>
      </el-form-item>
            <el-form-item label="操作人" prop="participants">
        <el-select v-model="pickForm.participantsId" class="input"  placeholder="请选择操作人">
          <el-option
            v-for="item in userList"
            :key="item.userId"
            :label="item.userName"
            :value="item.userId"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="采收时间"  prop="time">
        <el-date-picker
        class="input"
          v-model="pickForm.time"
          type="date"
          placeholder="选择日期"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="采收数量" prop="num">
        <el-input v-model="pickForm.num" placeholder="采收数量（公斤）"></el-input>
      </el-form-item>
      <el-form-item class="submitItem">
        <el-button type="primary" class="submitBtn" @click="submitForm('pickForm')"
          >立即创建</el-button
        >
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { addArgiMissionApi } from '@/api/mission'

export default {
  name: 'SevencolorUserFarmStockDialog',
  props: {
    userList: {
      type: Array
    }
  },

  data () {
    return {
      pickForm: {
        code: 'NS_CZ',
        baseId: 1,
        landId: null,
        harvestingWay: 0
      },
      rules: {
        harvestingWay: [
          { required: true, message: '请选择作业方式', trigger: 'change' }
        ],
        participantsId: [
          { required: true, message: '请选择操作人', trigger: 'change' }
        ],
        time: [
          { required: true, message: '请选择时间', trigger: 'change' }
        ],
        num: [
          { required: true, message: '请填写采收数量', trigger: 'change' }

        ]
      }
    }
  },

  mounted () {
    this.pickForm.baseId = +this.$route.query.baseId
    this.pickForm.landId = +this.$route.query.landId
  },

  methods: {
    submitForm (formName) {
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          this.pickForm.num = +this.pickForm.num
          const res = await addArgiMissionApi(this.pickForm)
          console.log(res)
        } else {
          alert('表单校验失败！')
          return false
        }
      })
    }
  }

}
</script>
<style lang="scss" scoped>
.active {
  border: 1px solid #64c3a4 !important;
  background: url("../../../assets/img/selected-ico.png") no-repeat right 3.7vw;
}
.seedAdd {
  height: 20vw;
  width: 32vw;
  padding: 0 2vw;
  overflow-y: auto;
}
.input {
  width: 22.8vw;
}
.more {
   margin: 1vw 0;
   text-align: center;
}
.submitBtn {
  width: 5vw;
  margin: 0 6vw;
}
</style>
